<template>
	<view id="page-transfer-description" >
		<uni-list>
			<uni-list-item 
				:class="'uni-list-item-'+item.orderNum"
				:title="item.siteName?item.siteName:item.lineName?item.lineName:item.walkName"
				:note="item.explain?item.explain:''"
				:show-extra-icon="true" 
				iconType="ali"
				:extra-icon="extraIcon(item,index)"
				v-for="(item,index) in schemeDescription" 
				:key="index" 
				@click="show(item)"
			>
			</uni-list-item>
		</uni-list>
	</view>
</template>

<script>
	import uniList from '@/components/uni-list/uni-list.vue'
	import uniListItem from '@/components/uni-list-item/uni-list-item.vue'
	import {
		uniSteps
	} from '@dcloudio/uni-ui'
	import { createNamespacedHelpers } from 'vuex'
	const { mapState,mapActions } = createNamespacedHelpers('transfer')
	export default {
		components: {uniSteps,uniList,uniListItem},
		data() {
			return {
			}
		},
		computed:{  
			...mapState(['schemeDescription']),
			extraIcon(){
				return (item,index)=>{
					let data={color: '#4cd964',size: '22',type: 'e631'};
					if(index==0){data.type="e633"}
					else if(index===this.schemeDescription.length-1){data.type="e635"}
					else if(item.siteName){data.type="e631"}
					else if(item.lineName){data.type="e62f"}
					else if(item.walkName){data.type="e636"}
					return data;
				}
			}
		},
		methods: {
			...mapActions(['PASS_LINE']),
			show(item){
				console.log(item)
				if(item.lineId){
					this.PASS_LINE(item.lineId)
					uni.navigateTo({
						url: '../../line-details/line-details'
					});
				}
				
			}
		}
	}
</script>

<style>
#page-transfer-description{
	width: 100%;
	padding: 20upx 0;
}
.uni-list-item-0,.uni-list-item-2,.uni-list-item-4,.uni-list-item-6,.uni-list-item-8{
	background-color: #eeeeee;
}
.uni-list-item-1,.uni-list-item-3,.uni-list-item-5,.uni-list-item-7,.uni-list-item-9{
	background-color: #cccccc;
}
</style>
